.divLocationView {
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0px 0px 6px 0px rgba(144, 142, 142, 0.17);
  margin: 20px 29px 30px 29px;
  height: calc(100vh - 114px);
  .divLocationViewCondition {
    width: 263px;
    padding: 27px 19px 27px 20px;
    float: left;
    .divAreaTop {
      margin-bottom: 21px;
      .divTitle {
        width: 64px;
        height: 22px;
        font-size: 16px;
        font-family: PingFangSC, PingFangSC-Medium;
        font-weight: 500;
        text-align: left;
        color: #332929;
        line-height: 22px;
        margin-bottom: 22px;
        margin-left: 10px;
      }
      .divWarehouseSelect {
        width: 224px;
      }
    }
    .divAreaContent {
      width: 224px;
      background: #fdfcf9;
      border: 1px solid #f7f2f1;
      border-radius: 6px;
      padding: 30px 29px 0 26px;
      .divAreaCondition {
        margin-bottom: 10px;
        .el-input__icon {
          cursor: pointer;
        }
      }
      .divAreaDetails {
        height: calc(100vh - 360px);
        position: relative;
        .divNoArea {
          position: absolute;
          left: 50%;
          top: 50%;
          transform: translate(-50%, -50%);
          .divFontDisplay {
            width: 56px;
            height: 20px;
            font-size: 14px;
            font-family: PingFangSC, PingFangSC-Semibold;
            font-weight: 600;
            text-align: left;
            color: #b5abab;
            line-height: 20px;
            margin: 0 auto;
            margin-bottom: 19px;
          }
          .importantButton {
            width: 126px;
          }
        }
        .divAreaList {
          height: 100%;
          .el-scrollbar {
            height: 100%;
            .scrollbar-wrapper {
              overflow-x: hidden !important;
              padding-right: 20px;
            }

            .el-scrollbar__view {
              height: calc(100% -500px);
              .divAreaItem {
                width: 140px;
                height: 40px;
                background: #ffffff;
                border-radius: 4px;
                box-shadow: 0px 0px 6px 0px rgba(255, 178, 0, 0.4);
                margin: 0 auto;
                margin-top: 20px;
                font-size: 13px;
                font-family: PingFangSC, PingFangSC-Medium;
                font-weight: 500;
                text-align: center;
                color: #ffb200;
                line-height: 40px;
                cursor: pointer;
              }
              .itemActive {
                background: #ffb200;
                color: #332929;
              }
            }

            .el-scrollbar__bar {
              &.is-vertical {
                right: 0px;
              }

              &.is-horizontal {
                display: none;
              }
            }
          }
        }
      }
    }
  }
  .divDivision {
    float: left;
    width: 10px;
    height: 100%;
    background: linear-gradient(
      270deg,
      rgba(255, 255, 255, 0),
      rgba(99, 97, 96, 0.1)
    );
  }
  .divLocationViewDisplay {
    padding: 27px 19px 27px 20px;
    float: left;
    height: 100%;
    width: calc(100% - 273px);
    .divTop {
      margin-bottom: 21px;
      height: 22px;
      .divTitle {
        width: 64px;
        height: 22px;
        font-size: 16px;
        font-family: PingFangSC, PingFangSC-Medium;
        font-weight: 500;
        text-align: left;
        color: #332929;
        line-height: 22px;
        float: left;
        margin-right: 103px;
      }
      .divOverView {
        float: left;
        .divItem {
          float: left;
          margin-right: 43px;
          &:last-child {
            margin-right: 0px;
          }
          .divSquare {
            float: left;
            margin-top: 5px;
            margin-right: 7px;
          }
          .spanLabel {
            float: left;
            margin-right: 4px;
            width: 70px;
            font-size: 14px;
            font-family: PingFangSC, PingFangSC-Regular;
            font-weight: 400;
            text-align: left;
            color: #424250;
          }
          span {
            height: 22px;
            line-height: 22px;
          }
        }
      }
    }

    .divContent {
      width: 100%;
      height: calc(100% - 43px);
      overflow-y: auto;
      .divSquare {
        display: inline-block;
        margin-right: 12px;
        margin-bottom: 10px;
      }
      .bgColorStop {
        background-color: #c3c3c3 !important;
        &:hover {
          border: 2px solid #7f7f7f;
        }
      }
      .bgColorUse {
        background-color: #00be76 !important;
        &:hover {
          border: 2px solid #008a56;
        }
      }
      .bgColorFree {
        background-color: #b2dccc !important;
        &:hover {
          border: 2px solid #00be76;
        }
      }
    }
  }
}

.el-tooltip__popper {
  background: #ffffff;
  box-shadow: 0px 3px 6px 5px rgba(0, 0, 0, 0.13);
  padding: 16px 24px 10px 23px;
  .divToolTipContent {
    div {
      margin-bottom: 12px;
      .spanLabel {
        margin-right: 15px;
        height: 17px;
        font-size: 12px;
        font-family: PingFangSC, PingFangSC-Medium;
        font-weight: 500;
        text-align: left;
        color: #b5abab;
        line-height: 17px;
      }
      .spanContent {
        height: 17px;
        font-size: 12px;
        font-family: PingFangSC, PingFangSC-Medium;
        font-weight: 500;
        text-align: left;
        color: #332929;
        line-height: 17px;
      }
    }
  }
  .popper__arrow {
    display: none;
  }
}
// .el-tooltip__popper[x-placement^='right'] .popper__arrow {
//   border-right-color: #fff;
//   box-shadow: 0 0 5px #000;
// }
// .popper__arrow {
//   border-color: #f00;
//   display: none;
// }
// .el-tooltip__popper .popper__arrow::after {
//   // box-shadow: 2px 2px 2px #ccc;
//   // border: solid 5px #ccc;
//   box-shadow: none;
//   border-color: #f4f4f4;
//   left: 12px;
//   // width: 15px;
//   // height: 15px;
// }
.is-light {
  border: 1px solid white !important;
  border: none;
}
